<template>
  <div id="foot">
    <ul>
      <li>
        <router-link to="/film"
          ><i class="iconfont icon-dianying"></i>电影</router-link
        >
      </li>
      <li>
        <router-link to="/cinema"
          ><i class="iconfont icon-yingyuan"></i>影院</router-link
        >
      </li>
      <li>
        <router-link to="/news"
          ><i class="iconfont icon-biaoqiankuozhan_zixun-229"></i
          >资讯</router-link
        >
      </li>
      <li>
        <router-link to="/my"
          ><i class="iconfont icon-wode"></i>我的</router-link
        >
      </li>
    </ul>
  </div>
</template>
<script>
export default {};
</script>
<style scoped lang='less'>
#foot {
  width: 100%;
  height: 1rem;
  position: fixed;
  bottom: 0;
  background-color: #fff;
  ul {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    height: 100%;
    li {
      font-size: 0.24rem;
      a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: #797d82;
        i {
          font-size: 0.42rem;
        }
      }
      .router-link-active {
        color: #ff5f16;
      }
    }
  }
}
</style>
